<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="keywords" content="" /> 
<meta name="description" content="" />
<title>购物车</title>
<link type="text/css" href="css/reset.css" rel="stylesheet" />
<link type="text/css" href="css/public.css" rel="stylesheet" />
<link type="text/css" href="css/style.css" rel="stylesheet" />
<link type="text/css" href="css/wode.css" rel="stylesheet" />
<script>
    var deviceWidth = Math.min(640, window.innerWidth)
    document.documentElement.style.fontSize = deviceWidth / 7.5 + "px"
</script>
</head>

<body>
<!-- top -->
<div class="header">
    <header class="p_header public-red">
        <h1 class="p_dizhi">进货车</h1>
        <a href="javascript:void(0);" class="p_header_right"><em id="Edit">编辑</em>
        </a>
    </header>
</div>
<!--购物车-->
<div class="huodong_shangpin  J-huodong-shangpin">
	<div class="gouwuche_goods">
		<!--店铺-->
		<div class="clearfix gouwuche_title">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="shopCheck" />
	            </label>
			</div>
			<h5>卡其店铺</h5>
		</div>
		<!--商品-->
		<div class="clearfix">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="goods-check" />
	            </label>
			</div>
			<div class="clearfix tuwen">
		    	<a href="javascript:void(0);" class="clearfix">
			        <div class="tuwen-img fl">
			            <img src="images/img.jpg" width="75" height="75">
			        </div>
			        <div class="tuwen-wenzi">
			            <h5 class="wuye_h01">开店区可重销活性多肽干细胞生物纤维补水紧致 2盒(10片)</h5>
			            <div class="wuye_div02">&yen;29.00-&yen;46.00</div>
			        </div>
		        </a>
		        <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
			    <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
		    </div>
		</div>
		<!--商品-->
		<div class="clearfix">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="goods-check" />
	            </label>
			</div>
			<div class="clearfix tuwen">
		    	<a href="javascript:void(0);" class="clearfix">
			        <div class="tuwen-img fl">
			            <img src="images/img.jpg" width="75" height="75">
			        </div>
			        <div class="tuwen-wenzi">
			            <h5 class="wuye_h01">开店区可重销活性多肽干细胞生物纤维补水紧致 2盒(10片)</h5>
			            <div class="wuye_div02">&yen;29.00-&yen;46.00</div>
			        </div>
		        </a>
		        <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
			    <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
		    </div>
		</div>
	</div>
	<div class="gouwuche_goods">
		<!--店铺-->
		<div class="clearfix gouwuche_title">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="shopCheck" />
	            </label>
			</div>
			<h5>卡其店铺</h5>
		</div>
		<!--商品-->
		<div class="clearfix">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="goods-check" />
	            </label>
			</div>
			<div class="clearfix tuwen">
		    	<a href="javascript:void(0);" class="clearfix">
			        <div class="tuwen-img fl">
			            <img src="images/img.jpg" width="75" height="75">
			        </div>
			        <div class="tuwen-wenzi">
			            <h5 class="wuye_h01">开店区可重销活性多肽干细胞生物纤维补水紧致 2盒(10片)</h5>
			            <div class="wuye_div02">&yen;29.00-&yen;46.00</div>
			        </div>
		        </a>
		        <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
			    <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
		    </div>
		</div>
	</div>
	<div class="gouwuche_goods">
		<!--店铺-->
		<div class="clearfix gouwuche_title">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="shopCheck" />
	            </label>
			</div>
			<h5>卡其店铺</h5>
		</div>
		<!--商品-->
		<div class="clearfix">
			<div class="public-xuanze fl public-checkbox">
				<label class="goodsCheck">
	            	<input type="checkbox" class="goods-check" />
	            </label>
			</div>
			<div class="clearfix tuwen">
		    	<a href="javascript:void(0);" class="clearfix">
			        <div class="tuwen-img fl">
			            <img src="images/img.jpg" width="75" height="75">
			        </div>
			        <div class="tuwen-wenzi">
			            <h5 class="wuye_h01">开店区可重销活性多肽干细胞生物纤维补水紧致 2盒(10片)</h5>
			            <div class="wuye_div02">&yen;29.00-&yen;46.00</div>
			        </div>
		        </a>
		        <div class="dingdan_fenlei clearfix">
			    	<ul class="fl">
			    		<li>颜色：<span>黑色</span></li>
			    		<li>尺码：<span>S</span></li>
			    		<li>单价：<span>58元/件</span></li>
			    	</ul>
			    	<div class="fr">
			    		<h5>98元</h5>
			    		<h6>4件</h6>
			    	</div>
			    </div>
		    </div>
		</div>
	</div>
</div>
<div class="gouwuche_footer">
	<div class="gouwuche_footer_con">
		<span>
			<div class="public-xuanze fl public-checkbox" style="margin-top: 6px;">
				<label class="goodsCheck">
                	<input type="checkbox" id="AllCheck" />
                </label>
			</div>
			全选
		</span>
		<div class="fl clearfix gouwuche_heji">
			<div class="fl">
				<h5>合计:<em>&yen;103.16</em></h5>
				<p>不含运费</p>
			</div>
			<input type="button" value="去结算(3)" />
		</div>
		<div class="gouwuche_delete">
			<input type="button" value="删除" />
		</div>
	</div>
</div>








<!-- footer -->
<div class="footer">
    <!-- footer -->
    <footer class="clearfix">
        <div class="p_footer">
            <a href="index.html">
                <i class="ico_index footer-ico01"></i>
                <span>主页</span>
            </a>
        </div>
        <div class="p_footer">
            <a href="8.0.0zhaohuo.html">
                <i class="ico_index footer-ico02"></i>
                <span>找货</span>
            </a>
        </div>
        <div class="p_footer">
            <a href="9.0.0shangquan.html">
                <i class="ico_index footer-ico03"></i>
                <span>商圈</span>
            </a>
        </div>
        <div class="p_footer">
            <a href="11.0.0gouwuche.html" class="p_on">
                <i class="ico_index footer-ico04"></i>
                <span>进货车</span>
            </a>
        </div>
        <div class="p_footer">
            <a href="buy/12.0.0buy_wode.html">
                <i class="ico_index footer-ico05"></i>
                <span>我的</span>
            </a>
        </div>
    </footer>
</div>




<script type="text/javascript" src="js/jquery-1.10.1.min.js" ></script>
<script type="text/javascript">
	
	<!--编辑  完成-->
 	$('#Edit').on('click',function(){
		if($(this).html() == '编辑') {
			$(this).html('完成');	
			$(".gouwuche_heji").hide();
			$(".gouwuche_delete").show();
		}else{
			$(this).html('编辑');	
			$(".gouwuche_heji").show();
			$(".gouwuche_delete").hide();	
		}					
	});	
	



//	$(".goods-check").click(function() {
//		
//		var goods = $(this).closest(".gouwuche_goods").find(".goods-check"); //获取本店铺的所有商品
//  	var goodsC = $(this).closest(".gouwuche_goods").find(".goods-check:checked"); //获取本店铺所有被选中的商品
//		if ($(this).prop('checked')) { 
//	    	$(this).closest('label').addClass('on');	
//	    	if (goods.length == goodsC.length){
//	    		$(this).closest("gouwuche_goods").find(".shopCheck").prop('checked', true).closest('label').addClass('on');
//	    	}else{
//	    		
//	    	}
//			
//	      	
//	    } else { //如果店铺按钮不被选中
//	    	$(this).closest('label').removeClass('on');	
//			
//	      	
//
//	    }
//		
//	});	
		
		
	$(".goods-check").click(function() {	
		
    	var goods = $(this).closest(".gouwuche_goods").find(".goods-check"); //获取本店铺的所有商品
    	var goodsC = $(this).closest(".gouwuche_goods").find(".goods-check:checked"); //获取本店铺所有被选中的商品
    	var Shops = $(this).closest("gouwuche_goods").find(".shopCheck"); //获取本店铺的全选按钮
    	if (goods.length == goodsC.length) { //如果选中的商品等于所有商品
        	Shops.prop('checked', true).closest('label').addClass('on'); //店铺全选按钮被选中
     		if ($(".shopCheck").length == $(".shopCheck:checked").length) { //如果店铺被选中的数量等于所有店铺的数量
        		$("#AllCheck").prop({"checked":true}).closest('label').addClass('on'); //全选按钮被选中
        	
        	} else {
        		$("#AllCheck").prop({"checked":false}).closest('label').removeClass('on'); //else全选按钮不被选中 
        	
       		}
    	} else { //如果选中的商品不等于所有商品
//  		goods.removeClass('on').closest('input').prop('checked', false);
      		Shops.prop('checked', false).closest('label').removeClass('on'); //店铺全选按钮不被选中
      		$("#AllCheck").prop({"checked":false}).closest('label').removeClass('on'); //全选按钮也不被选中
      
    	}
	});
	
	
	$(".shopCheck").click(function() {
	    if ($(this).prop('checked')) { //如果店铺按钮被选中
	    	$(this).closest('label').addClass('on');	
			$(this).parents(".gouwuche_goods").find(".goodsCheck").addClass('on').closest('input').prop({"checked":true}); //店铺内的所有商品按钮也被选中
	      	if ($(".shopCheck").length == $(".shopCheck:checked").length) { //如果店铺被选中的数量等于所有店铺的数量
	        	$("#AllCheck").prop({"checked":true}).closest('label').addClass('on'); //全选按钮被选中
	        
	      	} else {
	        	$("#AllCheck").prop({"checked":false}).closest('label').removeClass('on'); //else全选按钮不被选中
	      
	      	}
	    } else { //如果店铺按钮不被选中
	    	$(this).closest('label').removeClass('on');	
			$(this).parents(".gouwuche_goods").find(".goodsCheck").prop({"checked":false}).closest('label').removeClass('on'); //店铺内的所有商品也不被全选
	      	$("#AllCheck").prop({"checked":false}).closest('label').removeClass('on'); //全选按钮也不被选中

	    }
	});
	
	$("#AllCheck").click(function() {
    	if ($(this).prop("checked") == true) { //如果全选按钮被选中
      		$(".goodsCheck").addClass('on').closest('input').prop({"checked":true}); //所有按钮都被选中
      	
    	} else {
      		$(".goodsCheck").removeClass('on').closest('input').prop('checked', false); //else所有按钮不全选
     	
    	}
    	$(".shopCheck").change(); //执行店铺全选的操作
  	});

	
	
	
	
</script>
</body>
</html>